<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
	xmlns:h="http://xmlns.jcp.org/jsf/html"
	xmlns:f="http://xmlns.jcp.org/jsf/core"
	xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
	xmlns:p="http://primefaces.org/ui">
<f:view>
	<f:metadata>
		<f:viewAction action="#{menuMB.updateMenu(1)}" />
	</f:metadata>
	<ui:composition template="/WEB-INF/templates/defaultLayout.xhtml">

		<!-- Definiendo la cabecera de la pagina -->
		<ui:define name="title">
			<h:outputText value="Recalculo Cta. Plazo fijo" />
		</ui:define>

		<!-- Definiendo el cuerpo de la pagina -->
		<ui:define name="content">

			<h:outputStylesheet library="css" name="main.css" />
			<div>

				<br />
				<div>
					<h:panelGroup
						rendered="#{!cancelacionAnticipadaCuentaplazofijoBean.cuentaValida}">
						<div class="p6n-api-access-in-page-error" style="left: 516px;">
							<div>
								<div>
									<p>
										<h:messages />
									</p>
								</div>
							</div>
						</div>
					</h:panelGroup>
					<div style="margin-left: 50px;">
						<div>
							<div>
								<div class="p6n-api-consent-screen-title">RECÁLCULO DE CUENTA
									A PLAZO FIJO</div>
								<div class="p6n-api-consent-screen-inputs">
									<h:form>
										<p:focus for="txtNumeroCuenta"></p:focus>
										<div class="p6n-api-consent-screen-input-section">
											<div class="p6n-api-consent-screen-label">NÚMERO CUENTA</div>
											<div>
												<div style="float: left;">
													<h:inputText id="txtNumeroCuenta"
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.numerocuenta}"
														readonly="true" />
												</div>
												<div style="float: left;">
													<h:commandLink styleClass="button"
														style="margin: 0 0 0 1px;">
														<span class="icon icon198"></span>
														<f:ajax render=":panelGroupDialog :formDialog"
															listener="#{cancelacionAnticipadaCuentaplazofijoBean.setDlgBusquedaOpen(true)}" />
													</h:commandLink>
												</div>
											</div>
										</div>
										<div
											class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg"
											style="float: inherit;">
											<h:message for="txtNumeroCuenta" />
										</div>
									</h:form>

									<h:panelGroup id="panelGroupDialog">
										<h:panelGroup
											rendered="#{cancelacionAnticipadaCuentaplazofijoBean.dlgBusquedaOpen}">
											<h:form id="formDialog">
												<p:focus for="txtSearch"></p:focus>
												<div class="modal-dialog-bg"
													style="opacity: 0.4; width: 1366px; height: 1202px;"></div>
												<div class="modal-dialog p6n-popup"
													style="left: 302px; top: 50px;">
													<div
														class="modal-dialog-title modal-dialog-title-draggable">
														<span class="modal-dialog-title-text">BUSCAR CUENTA</span><span
															class="modal-dialog-title-close"></span>
													</div>
													<div class="modal-dialog-content">
														<div id="p6n-cloudsql-content">
															<div>
																<div>
																	<div>
																		<div>
																			<h:inputText id="txtSearch"
																				value="#{cancelacionAnticipadaCuentaplazofijoBean.campoBusqueda}"
																				style="width: 250px;float: left;" />
																			&nbsp;
																			<h:commandLink styleClass="button"
																				style="margin: 0px;float: left;">
																				<span class="icon icon198"></span>
																				<span class="label"></span>
																				<f:ajax execute="@form"
																					listener="#{cancelacionAnticipadaCuentaplazofijoBean.buscarCuentabancaria()}"
																					render="tblResultadoBusqueda" />
																			</h:commandLink>
																			<h:selectOneMenu id="cmbTipoBusqueda"
																				value="#{cancelacionAnticipadaCuentaplazofijoBean.comboTipodocumento.itemSelected}"
																				valueChangeListener="#{cancelacionAnticipadaCuentaplazofijoBean.changeTipodocumento}"
																				required="true"
																				requiredMessage="Seleccione un Tipo de Busueda">
																				<f:selectItem itemLabel="--Seleccione--"
																					itemValue="" />
																				<f:selectItems
																					value="#{cancelacionAnticipadaCuentaplazofijoBean.comboTipodocumento.items.entrySet()}"
																					var="val" itemLabel="#{val.value.abreviatura}"
																					itemValue="#{val.key}" />
																				<f:ajax execute="@this" />
																			</h:selectOneMenu>
																		</div>
																		<div
																			class="p6n-cloudsql-name-message p6n-cloudsql-input-message">
																			<h:messages />
																		</div>
																	</div>
																</div>
															</div>
															<hr />
															<div class="p6n-cloudsql-form" style="width: 705px;">
																<div
																	class="p6n-cloudsql-form-control p6n-cloudsql-form-control-name">
																	<div class="p6n-cloudsql-name-input ">
																		<div class="p6n-input-prepend"
																			style="display: initial;">
																			<p:dataTable id="tblResultadoBusqueda" var="cuenta"
																				value="#{cancelacionAnticipadaCuentaplazofijoBean.tablaCuentabancaria.rows}"
																				selectionMode="single"
																				selection="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected}"
																				rowKey="#{cuenta}" rowIndexVar="row"
																				paginator="true" rows="5" paginatorPosition="bottom"
																				paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
																				rowsPerPageTemplate="5">

																				<p:column headerText="Nº"
																					style="text-align:center;">
																					<h:outputText value="#{row + 1}" />
																				</p:column>
																				<p:column headerText="Nº Cuenta">
																					<h:outputText value="#{cuenta.numerocuenta}" />
																				</p:column>
																				<p:column headerText="Tipo Cta">
																					<h:outputText
																						value="#{cuenta.denominacionTipocuentabancaria}" />
																				</p:column>
																				<p:column headerText="Moneda">
																					<h:outputText
																						value="#{cuenta.denominacionTipomoneda}" />
																				</p:column>
																				<p:column headerText="Socio">
																					<h:outputText value="#{cuenta.socio}" />
																				</p:column>
																				<p:column headerText="Nº Doc.">
																					<h:outputText
																						value="#{cuenta.abreviaturaTipodocumento}: #{cuenta.numeroDocumento}" />
																				</p:column>
																				<p:column headerText="Saldo">
																					<h:outputText
																						value="#{cuenta.abreviaturaTipomomeda}#{cuenta.saldoCuentabancaria}" />
																				</p:column>
																			</p:dataTable>
																		</div>
																	</div>
																</div>
															</div>
														</div>
													</div>
													<div class="modal-dialog-buttons">
														<h:commandButton value="Aceptar"
															action="#{cancelacionAnticipadaCuentaplazofijoBean.setCuentabancariaSelected()}"
															styleClass="action green">
														</h:commandButton>
														<h:commandButton value="Cancelar" styleClass="action">
															<f:ajax render=":panelGroupDialog :formDialog"
																listener="#{cancelacionAnticipadaCuentaplazofijoBean.setDlgBusquedaOpen(false)}" />
														</h:commandButton>
													</div>
												</div>
											</h:form>
										</h:panelGroup>
									</h:panelGroup>

									<br />
									<div class="sf-separator p6n-api-consent-screen-input-section">
										<h3 class="p6n-api-consent-screen-title"
											style="color: #298B11;">Datos de Cuenta</h3>
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">SOCIO</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.socio}" />
												</div>
											</div>
										</div>
										<div style="display: inline-block;">
											<div class="p6n-api-consent-screen-label">DOCUMENTO</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.abreviaturaTipodocumento}" />
													<h:outputLabel value=":"
														rendered="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected != null}" />
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.numeroDocumento}" />
												</div>
											</div>
										</div>
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">NUMERO CUENTA</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.numerocuenta}" />
												</div>
											</div>
										</div>
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">TIPO CUENTA</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.denominacionTipocuentabancaria}" />
												</div>
											</div>
										</div>
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">TIPO MONEDA</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.abreviaturaTipomomeda} #{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.denominacionTipomoneda}" />
												</div>
											</div>
										</div>
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">DEPOSITO</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.saldoCuentabancaria}"
														styleClass="sf-label-bold" />
												</div>
											</div>
										</div>
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">INTERES</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.interesCuenta}"
														styleClass="sf-label-bold" />
												</div>
											</div>
										</div>
										<div style="display: inline-block;">
											<div class="p6n-api-consent-screen-label">TOTAL</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.totalCuentaAsString}"
														styleClass="sf-label-bold" />
												</div>
											</div>
										</div>
									</div>

									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">TEA</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.teaCuenta}"
														styleClass="sf-label-bold" />
												</div>
											</div>
										</div>										

									</div>

									<div class="p6n-api-consent-screen-input-section">
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">FECHA
												APERTURA</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.fechaaperturaCuentabancaria}">
														<f:convertDateTime pattern="dd/MM/yyyy" />
													</h:outputLabel>
												</div>
											</div>
										</div>
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">FECHA CIERRE</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.fechacierreCuentabancaria}">
														<f:convertDateTime pattern="dd/MM/yyyy" />
													</h:outputLabel>
												</div>
											</div>
										</div>
										<div style="display: inline-block;">
											<div class="p6n-api-consent-screen-label">PERIODO</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.periodoCuenta}" />

													<h:outputLabel value=" dias"
														rendered="#{cancelacionAnticipadaCuentaplazofijoBean.periodoCuenta != null}" />
												</div>
											</div>
										</div>
									</div>
									<div class="p6n-api-consent-screen-input-section">
										<div
											style="display: inline-block; width: 600px; vertical-align: top;">
											<div class="p6n-api-consent-screen-label"
												style="width: 150px;">TITULARES</div>
											<div style="width: 450px;">
												<h:dataTable
													value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancaria.titulares}"
													var="titular">
													<h:column>
										#{titular.personanatural.apellidopaterno}&nbsp;#{titular.personanatural.apellidomaterno}, #{titular.personanatural.nombres}
													</h:column>
													<h:column>
														&nbsp;|&nbsp;
														#{titular.personanatural.tipodocumento.abreviatura}:#{titular.personanatural.numerodocumento}
													</h:column>
												</h:dataTable>
											</div>
										</div>
										<div style="display: inline-block; width: 300px;">
											<div class="p6n-api-consent-screen-label">CANT.
												RETIRANTES</div>
											<div>
												<div>
													<h:outputLabel
														value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.cantidadretirantesCuentabancaria}"
														styleClass="sf-label-bold" />
												</div>
											</div>
										</div>
									</div>
									<br />

									<div class="sf-separator">
										<h3 class="p6n-api-consent-screen-title"
											style="color: #298B11;">Datos de Recálculo de Intereses</h3>
									</div>
									<h:form>
										<div>
											<div style="display: inline-block; width: 300px;">
												<div class="p6n-api-consent-screen-input-section">
													<div class="p6n-api-consent-screen-label">FECHA
														RECALCULO</div>
													<div>
														<p:calendar id="txtFecharecalculo"
															value="#{cancelacionAnticipadaCuentaplazofijoBean.fechaRecalculo}"
															required="true" pattern="dd/MM/yyyy"
															requiredMessage="Ingrese fecha de recalculo"
															pt:placeholder="dd/mm/yyyy">
															<f:convertDateTime pattern="dd/MM/yy" timeZone="EST" />
														</p:calendar>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="txtFecharecalculo" />
												</div>
												<div class="p6n-api-consent-screen-input-section">
													<div class="p6n-api-consent-screen-label">TEA</div>
													<div>
														<h:inputText id="txtTea" required="true"
															requiredMessage="Ingrese tea"
															converterMessage="Ingrese tea valido Ejemplo: 9.00"
															value="#{cancelacionAnticipadaCuentaplazofijoBean.teaRecalculo}"
															pt:placeholder="0.00">
															<f:converter converterId="javax.faces.BigDecimal"
																maxFractionDigits="2" minFractionDigits="2"
																pattern="0.00" />
														</h:inputText>
													</div>
												</div>
												<div
													class="p6n-api-consent-screen-input-error p6n-api-consent-screen-product-name-error-msg">
													<h:message for="txtTea" />
												</div>												
											</div>
											<div
												style="display: inline-block; margin-top: 25px; vertical-align: top;">
												<h1 class="sf-label-bold">RESUMEN</h1>
												<div class="p6n-cloudsql-summary">
													<div>
														<div class="p6n-cloudsql-summary-bold">Moneda</div>
														<div class="p6n-cloudsql-summary-light">
															<h:outputLabel
																value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.abreviaturaTipomomeda} #{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.denominacionTipomoneda}" />
														</div>
													</div>
													<div>
														<div style="display: inline-block; width: 150px;">
															<div class="p6n-cloudsql-summary-bold">Fecha
																apertura</div>
															<div class="p6n-cloudsql-summary-light">
																<h:outputLabel
																	value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.fechaaperturaCuentabancaria}">
																	<f:convertDateTime pattern="dd/MM/yyyy" />
																</h:outputLabel>
															</div>
														</div>
														<div style="display: inline-block; width: 150px;">
															<div class="p6n-cloudsql-summary-bold">Fecha cierre</div>
															<div class="p6n-cloudsql-summary-light">
																<h:outputLabel
																	value="#{cancelacionAnticipadaCuentaplazofijoBean.fechaRecalculo}">
																	<f:convertDateTime pattern="dd/MM/yyyy" />
																</h:outputLabel>
															</div>
														</div>
														<div style="display: inline-block;">
															<div class="p6n-cloudsql-summary-bold">Periodo</div>
															<div class="p6n-cloudsql-summary-light">
																<h:outputLabel
																	value="#{cancelacionAnticipadaCuentaplazofijoBean.periodoRecalculo}" />
																<h:outputLabel value=" dias"
																	rendered="#{cancelacionAnticipadaCuentaplazofijoBean.periodoRecalculo != null}" />
															</div>
														</div>
													</div>
													<div>
														<div style="display: inline-block; width: 150px;">
															<div class="p6n-cloudsql-summary-bold">Deposito</div>
															<div class="p6n-cloudsql-summary-light">
																<h:outputLabel
																	value="#{cancelacionAnticipadaCuentaplazofijoBean.cuentabancariaViewSelected.saldoCuentabancariaAsString}"
																	styleClass="sf-label-bold" />
															</div>
														</div>
														<div style="display: inline-block; width: 150px;">
															<div class="p6n-cloudsql-summary-bold">Interes</div>
															<div class="p6n-cloudsql-summary-light">
																<h:outputLabel
																	value="#{cancelacionAnticipadaCuentaplazofijoBean.interesRecalculado}"
																	styleClass="sf-label-bold" />
															</div>
														</div>
														<div style="display: inline-block;">
															<div class="p6n-cloudsql-summary-bold">Total</div>
															<div class="p6n-cloudsql-summary-light">
																<h:outputLabel
																	value="#{cancelacionAnticipadaCuentaplazofijoBean.totalRecalculado}"
																	styleClass="sf-label-bold" />
															</div>
														</div>
													</div>

												</div>
												<div class="p6n-cloudsql-buttonbar">
													<h:commandButton value="Recalcular"
														action="#{cancelacionAnticipadaCuentaplazofijoBean.recalcularInteres()}"
														styleClass="action red" />
												</div>
											</div>
										</div>


										<br />
										<br />
										<div class="sf-buttons" style="float: left;">
											<h:commandButton value="Guardar"
												action="#{cancelacionAnticipadaCuentaplazofijoBean.cancelarCuentaaporte()}"
												styleClass="action green" />
											<h:commandButton value="Cancelar" immediate="true"
												styleClass="action" />
										</div>
									</h:form>

									<h:panelGroup
										rendered="#{cancelacionAnticipadaCuentaplazofijoBean.cuentaCreada}">
										<h:form>
											<div class="modal-dialog-bg"
												style="opacity: 0.4; width: 1366px; height: 1102px;"></div>
											<div class="modal-dialog p6n-popup"
												style="left: 502px; top: 200px;">
												<div class="modal-dialog-title modal-dialog-title-draggable">
													<span class="modal-dialog-title-text">Recalculo
														realizado</span><span class="modal-dialog-title-close"></span>
												</div>
												<div class="modal-dialog-content ng-binding">La cuenta
													a plazo fijo fue recalculada satistactoriamente.</div>
												<div class="modal-dialog-buttons">
													<h:commandButton value="Salir"
														action="/caja/cuentasPersonales/index?faces-redirect=true" />
												</div>
											</div>
										</h:form>
									</h:panelGroup>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</ui:define>

	</ui:composition>
</f:view>
</html>
